<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width" />
	<title>登录</title>
	<link rel="stylesheet" type="text/css" href="/static/stylesheets/login.css">
	<link rel="stylesheet" type="text/css" href="/static/stylesheets/flexcss.css">
</head>
<body class="Site">
	<main class="Site-content Aligner">
		<section class="Container Aligner">
			<div id="center-logo">
				<a href="/home"><img src="/static/images/logo.png" alt=""></a>
			</div>
			<form action="/login/checkLogin" method="post" id="login-form">
				<div id="login-panel">
					<span class="name">登录</span>
					<div class="login-body">
						<div class="form-control">
							<input name = "username" type="text" placeholder="用户名" value="<?= $username?$username:''?>">
							<i class="iconfont icon-user"></i>
							<label class=".success" class="login-info"></label>
						</div>
						<div class="form-control">
							<input name = "password" type="password" placeholder="密码" value="<?= $password?$password:''?>">
							<i class="iconfont icon-password"></i>
							<label class="success" id="login-info"></label>
						</div>
						<section class="panel-bottom">
							<span><input type="checkbox" name = "remember" checked="checked" value="true"> 记住密码</span>
							<input type="submit" value="登 录">
						</section>
					</div>
				</div>
			</section>
		</form>
	</main>
	<?$this->load->view("inc/footer")?>
	<script src="/static/javascripts/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" src="/static/javascripts/jquery.validate.min.js"></script>
	<script type="text/javascript">
		$(function(){
			$("#login-form").validate({
	            rules: {
	                username: "required",
	                password: "required"
	            },
	            messages: {
	                username: "请输入用戶名",
	                password: "请输入密码"
	            },
	            submitHandler:function (form) {
	                $.ajax({
	                    type: $(form).attr('method'),
	                    url: $(form).attr('action'),
	                    data: $(form).serialize(),
	                    dataType : 'json'
	                }).done(function (data) {
	                    $("#login-info").removeClass("success");
	                    $("#login-info").removeClass("error");
	                    if (data.code == 1) {
	                            $("#login-info").addClass("success");
	                            $("#login-info").text(data.msg);
	                            window.setTimeout(function(){
	                                window.location.href="/home";
	                            },200)
	                        } else {
	                            $("#login-info").addClass("error");
	                            $("#login-info").text(data.msg);
	                        }
	                    });
	                  return false; // required to block normal submit since you used ajax
	             }
	        });
			$('input[type="checkbox"]').click(function () {
				$(this).val()?$(this).val(false):$(this).val(true);
			})
		});
	</script>
</body>
</html>
